import React, { Component } from 'react';
import { Table, Pagination, Tooltip } from 'antd';
import moment from 'moment';

class ReleaseTable extends Component {
  render() {
    const columns = [{
      title: 'Title',
      width: 180,
      render: (record) => {
        return (
          <Tooltip title={record.title}>
            <div className="title-name">{record.title}</div>
          </Tooltip>
        )
      }
    }, {
      title: 'Category',
      dataIndex: 'categoryName',
    }, {
      title: 'Press',
      dataIndex: 'press',
    }, {
      title: 'Key Word',
      render: (text, record) => {
        return (
          <Tooltip title={record.keywords}>
            <div className="title-name">{record.keywords}</div>
          </Tooltip>
        )
      }
    }, {
      title: 'Image/Video',
      dataIndex: '',
    }, {
      title: 'Reject Time',
      render: (text, record) => {
        return (
          <div>{moment(record.gmtModified).format('YYYY-MM-DD MM:ss')}</div>
        )
      }
    }, {
      title: 'Operation',
      render: (record) => {
        return (
          <div className="edit-config">
            <span className="edit-text" onClick={() => this.props.delete(record.id)}>Delete</span>
            <span className="edit-text" onClick={() => this.props.reapprove(record.id)}>Reapprove</span>
            <span className="edit-text" onClick={() => this.props.toEdit(record.id)}>Detail </span>
          </div>
        )
      }
    }];

    return (
      <div className="">
        <Table
          rowKey="id"
          className="select-table"
          rowSelection={this.props.rowSelection}
          dataSource={this.props.dataSource}
          columns={columns}
          pagination={false} />
        <Pagination
          className="tr mt10"
          showQuickJumper
          showSizeChanger
          showTotal={total => `Total ${total}`}
          total={this.props.dataTotal}
          onChange={this.props.pageOnChange}
          onShowSizeChange={this.props.pageSizeOnChange}
          current={this.props.pageCurrent} />
      </div>
    )
  }
}

export default ReleaseTable;
